<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>C2B码申请</title>
    <script type="text/javascript" th:src="@{/jquery-2.2.3.min.js}"></script>
    <script type="text/javascript" th:src="@{jquery.qrcode.min.js}"></script>
    <script type="text/javascript" th:src="@{jquery-barcode.js}"></script>
    <script language="javascript" type="text/javascript">
        $(function(){
            $("#btnApplyQrNo").click(function(){
                $.ajax({
                    type:"post",
                    url:"/C2B/ApplyQrNo",
                    data:{
                        "cardAttr":$("#cardAttr").val(),
                        "accNo":$("#accNo").val(),
                        "name":$("#name").val(),
                        "mobile":$("#mobile").val()
                    },
                    success:function(data){
                        $("#barCode").barcode(data,"codabar",{barWidth:1,width:256,height:50});
                        $("#qrCode").qrcode({
                            "render":"canvas",
                            "width":256,
                            "height":256,
                            "typeNumber":-1,
                            "correctLevel":0,
                            "text":data
                        });
                    }
                });
            });
        });
    </script>
</head>
<body>
<form method="post" th:action="@{/C2B/ApplyQrNo}">
    类型：<select id="cardAttr" name="cardAttr">
    <option value="01">借记卡</option>
    <option value="02">贷记卡</option>
</select>
    帐号：<input type="text" name="accNo" id="accNo" value="6216261000000002485"/>
    姓名：<input type="text" name="name" id="name" value="宋小"/>
    手机：<input type="text" name="mobile" id="mobile" value="13525677809"/>
    <input id="btnApplyQrNo" type="button" value="C2B码申请"/>
</form>
<div>广州银行(2485) <a href="#"> 更换</a></div>
<div style="margin-top: 1rem;" id="barCode"></div>
<div style="margin-top: 1rem" id="qrCode">

</div>
</body>
</html>